<template>
	<view>
		<details-head :imgs="allImgs"></details-head>
		<!-- 1，标题 -->
		<view class="con">
			<view class="con-title">
				<view class="con-title-img">
					<image :src="reqData.releaseUserHead"></image>
				</view>
				<view class="con-title-center">
					<view class="name">
						<text>{{reqData.releaseUserName}}</text>
					</view>
					<view class="address">
						<text>地址：{{reqData.address}}</text>
					</view>
				</view>
			</view>
			<view class="con-price">
				<text>￥：{{reqData.price}}</text>
			</view>
		</view>
		<!-- 2，分类 -->
		<view class="con type-class">
			<view class="left">服务分类</view>
			<view>{{typeName}}</view>
		</view>
		<!-- 3，具体需求 -->
		<view class="con">
			<view class="con-head">
				具体需求
			</view>
			<view class="con-box">
				<text>{{reqData.detail}}</text>
			</view>
		</view>

		<!-- 4，下单按钮 -->
		<my-bottom-btn :title="btnTitle" @clickBtn="clickBtn"></my-bottom-btn>
	</view>
</template>

<script>
	import detailsHead from './child/details-head.vue'
	import detailsConfirm from '@/components/content/my-confirm/my-confirm.vue'

	import myBottomBtn from '@/components/common/my-bottom-btn/my-bottom-btn.vue'


	import {
		getUserInfo
	} from '@/api/http/main/my/user.js'

	import {
		queryType
	} from '@/api/http/main/market/shop.js'

	import {
		placeAnOrder,
		findById
	} from '@/api/http/main/release/dynamic.js'

	import {
		getPayOrderInfo,
		insert
	} from '@/api/http/main/my/pay.js'


	export default {
		components: {
			detailsHead,
			myBottomBtn
		},
		data() {
			return {
				reqData: {},
				headImg: require('@/static/logo.png'),
				btnTitle: '立即下单',
				typeName: '',
				allImgs: []
			}
		},
		methods: {
			findById(id) {
				findById(id).then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message);
					}
					this.reqData = res.data.busInfo

					this.allImgs = res.data.busInfo.imgs.split(',')

				})
			},
			queryType(typeId) {
				queryType(typeId).then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message);
					}
					this.typeName = res.data.busInfo.typeName
				})
			},
			//1，下单
			async clickBtn() {
				//判断用户是否登录
				this.$isLoginByVisitor()
				if (uni.getStorageSync('isVisitorLogin')) {

					//判断是否实名认证 如果没有实名认证无法下单
					if (!uni.getStorageSync('identifyCheck')) {
						return uni.$showMsg('请先进行实名认证！')
					}
					var that = this
					uni.$isShowModal('是否确定下单？完成订单等商家确认后才能获得赏金！').then(resultState => {
						if (resultState) {
							var reqPlaceAnOrderObject = {
								releaseDynamicId: that.reqData.id,
								orderState: '2', //已支付
								state: '6' //用户已接单
							}
							placeAnOrder(reqPlaceAnOrderObject).then(resData => {
								//console.log(resData)
								if (resData.data.pubInfo.code !== 0) {
									return uni.$showMsg(resData.data.pubInfo.message);
								}
								uni.$showMsg('下单成功，请尽快完成！')

								return uni.switchTab({
									url: '/pages/main/home/home'
								})

								//return uni.$showMsg('充值成功');
							})
						}
					})

				}

			},

		},
		onLoad(e) {
			//this.reqData = JSON.parse(e.reqData)
			//console.log(JSON.parse(e.reqData))
			if (e) {
				this.findById(JSON.parse(e.reqData).id)
				this.queryType(JSON.parse(e.reqData).type)
			}


		}
	}
</script>

<style lang="scss" scoped>
	.con {
		width: 88%;
		margin-left: 4%;
		box-shadow: 0 0px 4px #ddd;
		padding: 2%;
		border-radius: 30rpx;
		margin-bottom: 30rpx;

		.con-title {
			display: flex;

			.con-title-img {
				image {
					width: 80rpx;
					height: 80rpx;
					border-radius: 50%;
					margin: 0 20rpx;
				}
			}

			.con-title-center {
				.name {
					font-size: 28rpx;
				}

				.address {
					font-size: 22rpx;
					color: rgba(166, 166, 166, 1);
				}
			}

		}

		.con-price {
			text {
				margin-left: 20rpx;
				font-size: 36rpx;
				color: rgba(212, 48, 48, 1);
			}
		}

		.con-head {
			font-size: 32rpx;
		}

		.con-box {
			text {
				font-size: 28rpx;
				color: rgba(128, 128, 128, 1);
				padding: 10rpx;
			}

		}

	}

	.type-class {
		display: flex;
		justify-content: space-between;
		font-size: 32rpx;

		.left {
			color: rgba(128, 128, 128, 1);
		}
	}
</style>